<title>部门设定</title>

<link rel="stylesheet" href="css/align.css" />
<!-- ajax layout which only needs content area -->
<div class="page-header">
	<h1>
		日报设定 <small> <i class="ace-icon fa fa-angle-double-right"></i>
			部门设定
		</small>
	</h1>
</div>
<!-- /.page-header -->

<div class="holyContainer">

	<div class="row main_container">
		<div class="col-xs-12">
			<!-- PAGE CONTENT BEGINS -->

			<div class="row">

				<div class="col-sm-6">
					<div class="widget-box">
						<div class="widget-header">
							<h4 class="widget-title lighter smaller">部门管理</h4>
						</div>

						<div class="widget-body">
							<div class="widget-main padding-8">
								<ul id="department-treeview"></ul>
							</div>
						</div>
					</div>
				</div>
				<div class="col-sm-6">

					<div class="widget-box ">
						<div class="widget-header">
							<h4 class="widget-title lighter smaller">部门详细信息</h4>
							<span class="widget-toolbar"> <a href="#"
								data-action="settings"> <i class="ace-icon fa fa-cog"></i>
							</a> <a href="#" data-action="reload"> <i
									class="ace-icon fa fa-refresh"></i>
							</a> <a href="#" data-action="collapse"> <i
									class="ace-icon fa fa-chevron-up"></i>
							</a>

							</span>
						</div>

						<div class="widget-body">
							<div class="widget-main">
								<!-- ajax -->
								<form>
									<div class="row">
										<div class="col-sm-6">

											<div class="form-group">

												<label class="control-label" for="form-field-1">编号</label> <input
													type="text" id="form-field-1" placeholder=""
													class="form-control dep_no" value="" readonly="" />
											</div>

										</div>
										<div class="col-sm-6">
											<div class="form-group">

												<label class="control-label" for="form-field-1">名称</label> <input
													type="text" id="form-field-1" placeholder=""
													class="form-control dep_name" value="" readonly="" />
											</div>
										</div>
									</div>
									<div class="row">
										<div class="col-xs-6">
											<label class="control-label" for="form-field-1">上级部门</label>
											<input type="text" id="form-field-1" placeholder=""
												class="form-control dep_parent_name" value="" readonly="" />
										</div>
										<div class="col-xs-6">
											<label class="control-label" for="form-field-1">部门备注</label>
											<input type="text" id="form-field-1" placeholder=""
												class="form-control dep_memo" value="" readonly="" />
										</div>

									</div>
									<hr />
									<div class="row col-xs-12">
										<span class="widget-toolbar"> 
										<a
											class="btn btn-primary btn-xs dep_add_btn">添加</a> 
										<a
											class="btn btn-primary btn-xs dep_update_btn">更新</a> 
										<a
											class="btn btn-primary btn-xs dep_delete_btn">删除</a>
										</span>
									</div>
									<div class="alert_container row col-xs-6"></div>
									<hr />
									<hr />



									<div class="row">
										<di class="col-xs-12"> <!-- TODO --> 子部门
										<table id="menu-management-table"
											class="table table-striped table-bordered table-hover">
											<thead>
												<tr>
													<th>编号</th>
													<th>名称</th>
													<th>备注</th>
													<th>操作</th>
												</tr>
											</thead>

											<tbody class="sub_parent_list">


											</tbody>
										</table>
										<!-- TODO add buttons, add fucking js--> <em>所有部门名称不能重复,这里应该还有一些按钮。对checkbox进行操作</em>
										</di>
									</div>
								</form>
							</div>
						</div>
					</div>
					<hr />

				</div>
			</div>

			<!-- /section:plugins/fuelux.treeview -->
			<script type="text/javascript">
				var $assets = "lib/assets";//this will be used in fuelux.tree-sampledata.js
			</script>

		</div>
		<!-- /.col -->
	</div>
</div>

<div class="drm_view_container"></div>

<script src="js/dep.tree.js" type="text/javascript"></script>


<script type="text/javascript">
	$(function() {

	})
	var scripts = [ null, "lib/assets/js/fuelux/fuelux.tree.js", null ]

	$('.page-content-area')
			.ace_ajax(
					'loadScripts',
					scripts,
					function() {
						jQuery(function($) {

							var tree_data;
							//          $.ajax({
							//                type: "POST",
							//                url: "/yangming_rms/depTree",
							//                data: {
							//                    "service": "searchDeps",
							//                },
							//                success: function (data) {
							//                    var jsonData = eval('(' + data + ')');
							//
							//                    if (jsonData.messageType == "success") {
							//
							//                        console.log(JSON
							//                                .stringify(jsonData.response));
							//
							//                        tree_data = jsonData.response;
							//
							//                        //加载shu
							//                        $('#department-treeview').ace_tree({
							//                            dataSource: treeview_dataSource,
							//                            loadingHTML: '<div class="tree-loading"><i class="ace-icon fa fa-refresh fa-spin blue"></i></div>',
							//                            'open-icon': 'ace-icon fa fa-folder-open',
							//                            'close-icon': 'ace-icon fa fa-folder',
							//                            'selectable': false,
							//                            multiSelect: false,
							//                            'selected-icon': null,
							//                            'unselected-icon': null
							//                        });
							//                    } else {
							//                        alert("获取部门信息失败");
							//                    }
							//                }
							//            }); 

							var treeview_dataSource = function(options,
									callback) {
								var $data = null
								if (!("text" in options)
										&& !("type" in options)) {
									$data = tree_data;//the root tree
									callback({
										data : $data
									});
									return;
								} else if ("type" in options
										&& options.type == "folder") {
									if ("additionalParameters" in options
											&& "children" in options.additionalParameters)
										$data = options.additionalParameters.children
												|| {};
									else
										$data = {}//no data
								}

								if ($data != null)//this setTimeout is only for mimicking some random delay
									setTimeout(function() {
										callback({
											data : $data
										});
									}, parseInt(Math.random() * 500) + 200);

							}

							$('#department-treeview').on('loaded.fu.tree',
									function(e) {

									}).on('updated.fu.tree',
									function(e, result) {
										alert("update");
									}).on('selected.fu.tree', function(e) {
								alert("select");
							}).on('deselected.fu.tree', function(e) {
								alert("deselect");
							}).on('opened.fu.tree', function(e) {
								//                        var output = '';
								//                        var items = $('#department-treeview' ).tree('selectedItems' );
								//                        for (var i in items) if (items.hasOwnProperty(i)) {
								//                            var item = items[i];
								//                            output +=  item.text + "\n";
								//                        }

								//                        alert("open : " + output);
							}).on('closed.fu.tree', function(e) {
								alert("close : ");
							});

						});
					});
</script>